<template>
	<view class="order">
		<u-cell class="address" 
			:title="defAddress.address?defAddress.address:''" 
			:label="defAddress.name?defAddress.name+' '+defAddress.phone:''" 
			:isLink="true"
			@click="addressClick"></u-cell>
		<view class="order-group">
			<view class="order-item" v-for="item in carts" :key="item.id">
				<image :src="item.goods.cover_url"></image>
				<view class="item-right">
					<view class="title">{{item.goods.title}}</view>
					<view class="goods-info">
						<text class="price">￥{{item.goods.price}}</text>
						<text class="number">x {{item.num}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="order-pay">
			<view class="all-price">合计：<text>￥{{totalPrice}}</text></view>
			<u-button class="submit" type="error" shape="circle" text="提交订单并支付 " size="normal" @click="toPay"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				address: [],
				carts: [],
				defAddress: {},
				totalPrice: 0,
				first: true
			};
		},
		onLoad() {
			this.getOrders()
		},
		methods: {
			async getOrders() {
				const res = await uni.$u.http.get('/api/orders/preview')
				// console.log(res)
				this.address = res.address
				this.carts = res.carts
				
				// 获取上一页数据
				let page = getCurrentPages()
				page = page[page.length-2]?.route
				if (page === 'pages/profile/address/address') {
					this.selectAddress()
				}else {
					this.address.map(item => {
						if (item.is_default === 1) {
							this.defAddress = item
						}
					})
				}
				this.sunPrice()
			},
			// 获取选中的地址
			selectAddress() {
				const id = uni.getStorageSync('address_id')
				console.log(id)
				if (id) {
					this.address.map(item => {
						if (item.id === id) {
							this.defAddress = item
						}
					})
				}
				console.log(this.defAddress)
			},
			// 合计总价
			sunPrice() {
				let total = this.carts.reduce((pre, next)=> {
					if (next.is_checked === 1) {
						return pre + next.num * next.goods.price
					}else {
						return pre
					}
				}, 0)
				this.totalPrice = total.toFixed(2)
			},
			// 去支付页面
			toPay() {
				
			},
			// 跳转到地址页面
			addressClick() {
				uni.$u.route({
					url: 'pages/profile/address/address',
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.order {
	.address {
		margin-bottom: 40rpx;
	}
	.order-group {
		padding-bottom: 100rpx;
	}
	.order-item {
		display: flex;
		padding: 30rpx;
		background-color: #f3f3f3;
		image {
			width: 180rpx;
			height: 180rpx;
		}
		.item-right {
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			font-weight: 700;
			.title {
				margin-left: 40rpx;
			}
			.goods-info {
				display: flex;
				justify-content: space-between;
				margin-left: 20rpx;
				.price {
					color: #b31d28;
				}
			}
		}
	}
	.order-pay {
		position: fixed;
		bottom: 0;
		width: 100%;
		display: flex;
		justify-content: space-around;
		background-color: #FFFFFF;
		.all-price {
			flex: 1;
			text-align: center;
			line-height: 100rpx;
			text {
				color: #b31d28;
			}
		}
		.submit {
			flex: 1;
				margin: 10rpx 40rpx 10rpx 0;
		}
	}
}
</style>
